import React from 'react';
import cx from 'classnames';
import S from './saleGuide.m.less';

export default function SaleGuide(props) {
    const entries = [
        {
            title: '直播',
            icon: 'https://cdn.weipaitang.com/static/201905164af91acb-0eaf-48bd-b4f6-a3d28db87c90-W132H132',
            url: '/live/channel?r=404error',
        },
        {
            title: '名家精选',
            icon: 'https://cdn.weipaitang.com/static/20190516cdc2b10f-1f88-4316-a881-f7662c26301a-W132H132',
            url: '/dashi/home?r=404error',
        },
        {
            title: '优店',
            icon: 'https://cdn.weipaitang.com/static/20190516d5998c80-424c-40f2-9f98-33ea1cf806fc-W132H132',
            url: '/goodShop?r=404error',
        },
        {
            title: '捡漏',
            icon: 'https://cdn.weipaitang.com/static/2019051622b5c5b7-a5a2-4f7c-b706-7416855498c1-W132H132',
            url: '/cheap?r=404error',
        },
    ];
    const { r } = props;

    return (
        <div className={cx(S.recommendMain, props.className)} style={{ ...props.style }}>
            <div className={S.recommendBox}>
                <div className={S.title}>
                    热门频道
                    <img
                        className={S.hotImg}
                        src="https://cdn.weipaitang.com/static/20190516a4c96bcf-b243-4245-afb3-797622f2fd9e-W86H36"
                    />
                </div>
                <div className={S.channelList}>
                    {entries.map((item, i) => (
                        <Link key={item.url} href={r ? `${item.url}-${r[i]}` : item.url} className={S.channelItem}>
                            <img className={S.icon} src={item.icon} />
                            {item.title}
                        </Link>
                    ))}
                </div>
            </div>
        </div>
    );
}
